<style type="text/css">
  p {
    width: 50px;
    margin: 0;
    padding: 5px 10px;
    background-color: #2c3e50;
    color: #fff;
    text-align: center;
    border-radius: 5px;
  }
  .itemWrap {
    min-height: 50px;
  }
  p:hover {
    cursor: pointer;
    opacity: .6;
  }
  .item {
    display: flex;
    flex-flow: row;
    align-items: center;
    margin: 10px 0;
  }
  .item>input {
    margin-right: 15px; 
  }
  .remove {
    background-color: red;
    color: #fff;
  }
</style>

<p id="add">添加</p>
<div class="itemWrap">
    <div class="item">
      <input type="text" value='最大人数限制' disabled style='border:0px'>
      <input type="text" value='价格' disabled style='border:0px'>
    </div>
    {if condition="empty($info)"}
    <div class="item">
      <input type="text" name="max_person_value" value=''>
      <input type="text" name="price" value=''>
      <p class="remove">删除</p>
    </div>
    {else /}
      {volist name="info" id="vo"}
      <div class="item">
        <input type="text" name="max_person_value" value='{$vo.max_person_value}'>
        <input type="text" name="price" value='{$vo.price}'>
        <p class="remove">删除</p>
      </div>
      {/volist}
    {/if}
  
</div>
<input type='hidden' name='ggs_id' value="{$ggs_id}">
<p id="submit">提交</p>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
  
 $('#add').click(function(){


    $('.itemWrap').append(`<div class="item">
    <input type="text" name="max_person_value">
    <input type="text" name="price">
    <p class="remove">删除</p>

  </div>`)
    $('.remove').click(function(){

       $(this).parent().remove();
    })
 })
 // var remove = document.getElementsByClassName('remove');
 $('.remove').click(function(){
    $(this).parent().remove();
 })

 $('#submit').click(function(){
  var arr = [];
    $('.item').each(function(x,y){
      if (x<1) {
        return;
      }
      var obj = {
        max_person_value:$(this).children().eq(0).val(),
        price:$(this).children().eq(1).val()
      }
      arr.push(obj)
    })
    info = JSON.stringify(arr)
    ggs_id = $("input[name='ggs_id']").val();
    $.ajax({
      type:'post',
      url:"{:url('activity/group_detail/update_area')}",
      data:{
        info:info,
        ggs_id:ggs_id
      },
      success:function(msg){
        if(msg.state == 1){
          layer.msg('更新成功！');
          setTimeout(function(){
           sessionStorage.setItem('status',2)
          },2000);
        }else{
          layer.msg('添加失败！');
        }
      }
    })
 })
</script>